/**
 * 利用dll技术，对包进行单独打包
 */
const { resolve } = require("path");
const webpack = require("webpack");
const { VueLoaderPlugin } = require('vue-loader');
// node fs模块
const fs = require('fs');
// var readDir = fs.readdirSync("./src/testData");
// console.log('readDir', readDir);

// node path模块
const path = require('path');
// 被读取的文件夹地址
const filePath = path.resolve('./src/testData');
// 收集所有的文件路径
const arr = [];
const fileDisplay = filePath => {
    //根据文件路径读取文件，返回文件列表
    const files = fs.readdirSync(filePath)
    files.forEach((filename) => {
        //获取当前文件的绝对路径
        const filedir = path.join(filePath, filename);
        // fs.stat(path)执行后，会将stats类的实例返回给其回调函数。
        const stats = fs.statSync(filedir)
        // 是否是文件
        const isFile = stats.isFile();
        // 是否是文件夹
        const isDir = stats.isDirectory();
        if (isFile) {
            // 这块我自己处理了多余的绝对路径，第一个 replace 是替换掉那个路径，第二个是所有满足\\的直接替换掉
            arr.push(filedir.replace(/\\/img, '/'))
            // 最后打印的就是完整的文件路径了
        }
        // 如果是文件夹
        if (isDir) fileDisplay(filedir);
    });
}
fileDisplay(filePath);
console.log('arr', arr)

// let contexts = require.context('./src/testData', false, /\.js$/)
// console.log('contexts', contexts)
// contexts.keys().forEach(component => {
//     // debugger;
//     let componentEntity = contexts(component).default
//     // 使用内置的组件名称 进行全局组件注册
//     Vue.component(componentEntity.name, componentEntity)
// })

module.exports = {
    mode: "production",
    entry: {
        vue: ["vue"],
        // './src/testData/a.js' 可行.  换成'./src/testData/index.js'失败,间接引用不会使用dll打包出来的东西
        // ['./src/testData/a.js','./src/testData/b.js',] 可行.  由此可见,entry的名字是随意的,会对数组的内容进行DLL
        a: arr
    },
    output: {
        filename: "[name].js",
        path: resolve(__dirname, "dll"),
        library: "[name]" //打包出来的库对外暴露出来的内容叫什么名字
    },
    plugins: [
        //打包生成一个manifest.json --> 提供映射关系
        new webpack.DllPlugin({
            name: "[name]", //映射库的暴露的内容名称
            path: resolve(__dirname, "dll/[name].manifest.json") //输出文件路径
        }),
        new VueLoaderPlugin()
    ],
    resolve:{
        alias:{
            '@src': '/src'
        }
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                use: [
                    { loader: 'vue-loader' }
                ],
            },
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader'],
            }
        ]
    }
};